<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<new th:fragment="hasbei_text">

    <head>
        <meta charset="UTF-8">
        <style>
            #form-title {
                display: inline-block;
                width: 100%;
                border: 0;
                outline: none;
                border-bottom: none;
                margin: 20px 0;
                color: #222;
                font-size: 24px;
                box-sizing: border-box;
                padding: 0 10px;
            }
        </style>
    </head>
    <body>


    <div class="container">
        <div id="mytext" style="display:none;">
            <input type="text" id="form-title" maxlength="100" placeholder="请输入文章标题（5-100个汉字）">
            <select id="classType" name="state" style="height: 50px">
                <option>咨询问答类型类型</option>
                <option th:each="class:${zxClassifyTList}" th:classid="${class.getClassifyId()}" th:text="${class.getClassifyName()}"></option>
            </select>
            <div id="editor">
                <p id="myplaceholder" style="color: #999">请输入相关口腔文章、资讯内容</p>
            </div>
            <div style="font-size: 13px;">
                字数：<span id="textlength">0</span>
            </div>
        </div>

        <!-- 注意， 只需要引用 JS，无需引用任何 CSS ！！！-->

        <script type="text/javascript" src="/js/wangEditor.min.js"></script>
        <script type="text/javascript">
            var E = window.wangEditor
            var editor = new E('#editor')
            editor.customConfig.onchange = function (text) {
                // html 即变化之后的内容
                $("#textlength").text(editor.txt.text().length)
            }
            // 下面两个配置，使用其中一个即可显示“上传图片”的tab。但是两者不要同时使用！！！
            editor.customConfig.uploadImgShowBase64 = true   // 使用 base64 保存图片
            // editor.customConfig.uploadImgServer = '/upload'  // 上传图片到服务器

            // editor.customConfig.customUploadImg = function (files, insert) {
            //     // files 是 input 中选中的文件列表
            //     // insert 是获取图片 url 后，插入到编辑器的方法
            //     console.log(files);
            //     // 上传代码返回结果之后，将图片插入到编辑器中
            //     insert(files.name)
            // }


            // 或者 var editor = new E( document.getElementById('editor') )
            editor.create()

            $("#editor").click(function () {
                $("#myplaceholder").text("");
            })
        </script>


    </div>
    </body>

</new>
</html>